<div class="ui padded grid">
<div class="row">
    <div class="column">
        <div class="ui segment page blue">
            <h2 class="ui header">{{vm.selectedRepository.name}}</h2>
            <div class= "ui grid">
                <div class="three column row">
                    <div class="column">
                        <div class="ui statistic">
                            <div class="value">
                                <i class="tag icon"></i> {{vm.selectedRepository.tags.length}}
                            </div>
                            <div class="label">
                                标签
                            </div>
                        </div>
                    </div>
                    <div class="column">
                        <div class="ui statistic">
                            <div class="value">
                                <i class="block layout icon"></i> {{vm.selectedRepository.layers.length}}
                            </div>
                            <div class="label">
                                层
                            </div>
                        </div>
                    </div>
                    <div class="column">
                        <div class="ui statistic">
                            <div class="value">
                                <i class="disk outline icon"></i> {{vm.selectedRepository.size / 1048576 | number:2}}
                            </div>
                            <div class="label">
                                MB
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="ui divider"></div>

            <h2 class="ui header">层</h2>
            <div class="ui segment" ng-repeat="l in vm.selectedRepository.layers">
                <div class="ui right floated header">
                    <div class="ui green label" ng-show="l.size">{{l.size / 1048576 | number:2}} MB</div>
                    <div class="ui orange label" ng-show="l.os">{{l.os}}</div>
                    <div class="ui blue label" ng-show="l.architecture">{{l.architecture}}</div>
                    <div class="ui grey label" ng-show="l.docker_version">{{l.docker_version}}</div>
                    <div class="ui label">{{l.created}}</div>
                </div>

                <h4 class="ui left floated header">
                    <i class="puzzle icon"></i>
                    <div class="content">
                        {{l.id}}
                        <div class="sub header">{{l.author}}</div>
                    </div>
                </h4>

                <div class="ui clearing divider"></div>
                <div class="content">
                    <div ng-show="l.container_config.Cmd">
                        <div class="ui bulleted list">
                            <div class="item">
                                {{l.container_config.Cmd.join(" ")}}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
